<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>管理我的收藏</title>
</head>
<body>
<a href="my_favorite_add.html"><input type="button" value="新增"></a>|
<a href="index.html"><input type="button" value="我的收藏"></a><br>
<hr>
<table id="myFavorites" border="1" cellspacing="0" width="100%">
    <tr>
        <td bgcolor="#A3E6DF">id</td>
        <td bgcolor="#A3D7E6">收藏名称</td>
        <td bgcolor="#A3CCE6">收藏的链接</td>
        <td bgcolor="#A3CCE6">分类名称</td>
        <td bgcolor="#A3CCE6">登录名称</td>
        <td bgcolor="#A3CCE6">登录密码</td>
    </tr>

</table>

<script src="../js/axios-0.18.0.js"></script>
<script>
    //1. 当页面加载完成后，发送ajax请求
    window.onload = function () {
        //2. 发送ajax请求
        axios({
            method:"get",
            url:"getMyFavorites"
        }).then(function (resp) {
            //获取数据
            let map = resp.data;
            console.log(map);
            let tableData = " <tr>"+
                "<td bgcolor=\"#A3E6DF\">id</td>"+
                "<td bgcolor=\"#A3D7E6\">收藏名称</td>"+
                "<td bgcolor=\"#A3CCE6\">收藏的链接</td>"+
                "<td bgcolor=\"#A3CCE6\">分类名称</td>"+
                "<td bgcolor=\"#A3CCE6\">登录名称</td>"+
                "<td bgcolor=\"#A3CCE6\">登录密码</td>"+
                "</tr>";
            Object.entries(map).forEach(([category,favorites]) =>{
                myFavorites +="<p>"+category+"</p>";
                for (let i = 0; i < favorites.length ; i++) {
                    let obj = favorites[i];
                    tableData += "\n" +
                        "    <tr align=\"center\">\n" +
                        "        <td>"+obj.id+"</td>\n" +
                        "        <td>"+obj.favoriteName+"</td>\n" +
                        "        <td>"+obj.linkUrl+"</td>\n" +
                        "        <td>"+obj.categoryName+"</td>\n" +
                        "        <td>"+obj.loginName+"</td>\n" +
                        "        <td>"+obj.password+"</td>\n" +
                        "        <td> <a href='toEditMyFavoritePage?favoriteId=" +obj.id+"'>编辑1</a></td>\n" +
                        "        <td> <a href='my_favorite_edit.html?favoriteId=" +obj.id+"'>编辑2</a></td>\n" +
                        "        <td> <a href='delMyFavorite?favoriteId=" +obj.id+"'>删除</a></td>\n" +
                        "    </tr>";
                }
            });


            // 设置表格数据
            document.getElementById("myFavorites").innerHTML = tableData;
        })
    }
</script>
</body>
</html>